<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>百度一下，你就知道</title>
    <style>
        *{
            padding: 0px;
            margin:0px;
            list-style: none;
        }
        .header{
            height:57px;
           
        }
        .header u{
            background:blue;
            color:white;
            float:right;
        }
        .header a{
            float:right;
            margin-right:20px;
            color:black;
            font-weight: bold;
        }
        .nav{
            margin-left:auto;
            margin-right:auto;
            width: 1000px;
            /* background:red; */
        }
        .nav img{
           height: 150px;
           margin-left:300px;
           margin-bottom: 15px;
        }
        .nav .bollow{
            margin-left:auto;
            margin-right:auto;
            width:700px;
            /* background:chartreuse; */
        }
        .nav .bollow a{
            background:blue;
            float:right;
            font-size: 20px;
            padding:8px;
            color:white;
            text-decoration: none;
            border:1px solid black;
            margin-left:0px;
            position: absolute;
        
        }
        .nav .bollow a:hover{
            background:rgb(69, 69, 236);
        }
        .nav .bollow input{
            width:600px;
            height:40px;
            position: relative;
            
        }
        .footer{
            margin-left: auto;
            margin-right:auto;
            width:1000px;
            margin-top:50px;
            
        }
        .footer .above img{
            height: 100px;
            margin-left: 398px;
            margin-top:303px;
        }
        .footer .above span{
            margin-left: 404px;
            font-weight: bold;
            font-size:20px;
        }
        .footer .bollow{
            height:300px;
        }
        .footer .bollow a{
            margin-right:20px;
            float:right;
            color:gray;
            font-size:20px;
            
        }
        .footer .bollow u{
            margin-right:277px;   
        }
        .footer .shang{
            margin-top:70px;
        }
        .footer .bollow p{
            float:right;
            
            font-size:20px;
            margin-right:20px;
        }
        .footer .bollow .xia{
            float:left;
            margin-left:181px;
        }

    </style>
</head>
<body>
    <div class="header">
            <u>更多产品</u>
            <ul>
           <li><a href="">设置</a></li>
           <li><a href="">登录</a></li>
           <li><a href="">贴吧</a></li>
           <li><a href="">视频</a></li>
           <li><a href="">hao123</a></li>
           <li><a href="">新闻</a></li>
           <li><a href="">糯米</a></li>
           <li><a href="">地图</a></li>
            </ul>
    </div>
    <div class="nav">
                <h1><img src="images/bd_logo1.png" alt=""></h1>
       <div class="bollow"><input type="text" name="" id="" checked>
                <a href="">百度一下</a>
        </div>
    </div>
    <div class="footer">
        <div class="above"><img src="images/zbios_efde696.png" alt=""><br>
        <span>手机百度</span>
        </div>
        <div class="bollow">
       <div class="shang"> <ul><li><a href=""><u>把百度设为主页</u></a></li>
        <li><a href="">关于百度</a></li>
        <li><a href="">About Baidu</a></li>
        <li><a href="">百度推广</a></li></ul></div>
       <div class="xia"> <br><p>2016 Baidu</p><a href="">使用百度前必读</a><p>意见反馈</p><a href="">京ICP证030173号</a></div>
        </div>
    </div>
</body>
</html>